<template>
  <el-card>
    <div>最近一次更新时间：{{ this.tableData ? this.tableData.updated_at : ""  }}</div>
    <br />
    <div style="width: 80%;margin: auto;">
      <div >
        <vue-ueditor-wrap  v-model="detail" :config="myConfig"></vue-ueditor-wrap>
      </div>
      <br />
      <div style="text-align: center;">
        <el-button type="success" @click="setContactCustomerService">发布</el-button>
      </div>
    </div>
  </el-card>
</template>

<script>
import VueUeditorWrap from 'vue-ueditor-wrap' // ES6 Module
export default {
  name: "publicity.vue",
  data(){
    return{
      detail: '',
      tableData: null,
      myConfig: {
        // 编辑器不自动被内容撑高
        autoHeightEnabled: false,
        // 初始容器高度
        initialFrameHeight: 500,
        // 初始容器宽度
        initialFrameWidth: '100%',
        // 上传文件接口（这个地址是我为了方便各位体验文件上传功能搭建的临时接口，请勿在生产环境使用！！！）
        // serverUrl: 'http://35.201.165.105:8000/controller.php',
        serverUrl: 'https://wxapp.gdhrma.org.cn/ueditor-php/controller.php',
        // UEditor 资源文件的存放路径，如果你使用的是 vue-cli 生成的项目，通常不需要设置该选项，vue-ueditor-wrap 会自动处理常见的情况，如果需要特殊配置，参考下方的常见问题2
        //UEDITOR_HOME_URL: '/peoples_association_backstage/dist//static/UEditor/'
        UEDITOR_HOME_URL: '/UEditor/',
        zIndex: 10001,
        toolbars: [
          [
            'undo', 'redo', '|',
            'bold', 'italic', 'underline', 'strikethrough',
            'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor',
            'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
            'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
            'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
            'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|',
            'simpleupload', 'insertimage', 'insertvideo', 'music',
            'horizontal', 'date', 'time',
            'inserttable','link'

          ]
        ]
      },
    }
  },
  methods: {
    //获取关于我们详情
    async getContactCustomerService(){
      const res = await this.$api.getContactCustomerService();
      if(res.data.level === 'success'){
        this.tableData = res.data.data;
        this.detail = res.data.data ? res.data.data.detail : "";
      }else {
        this.$message.error(res.data.message)
      }
    },

    //编辑关于我们
    async setContactCustomerService(){
      let params = {
        "detail": this.detail
      }
      const res = await this.$api.setContactCustomerService(params);
      if(res.data.level === 'success'){
        this.$message({
          message: '修改成功',
          type: 'success'
        });
        await this.getContactCustomerService()
      }else{
        this.$message({
          message: res.data.message,
          type: 'warning'
        });
      }
    },

  },
  mounted() {
    this.getContactCustomerService();
  },
  components:{VueUeditorWrap}
}
</script>

<style lang="scss" scoped>

</style>
